<template>
	<view class="container">
		<uni-forms err-show-type="undertext" :value="formData" ref="form" border="true" label-width="100">
			<uni-group title="基本信息" top="0">
				<uni-forms-item required label="服务器" name="serverId">
					<uni-easyinput type="number" trim="all" @blur="serverIdBlur" v-model="formData.serverId"
						placeholder="请输入服务器编号" />
				</uni-forms-item>
				<uni-forms-item required label="联盟名称" name="unionName">
					<uni-combox :candidates="formData.serverNames" v-model="formData.unionName" placeholder="请输入联盟名称" />
				</uni-forms-item>
				<uni-forms-item required label="邀请码" name="invitationCode">
					<uni-row class="demo-uni-row">
						<uni-col :span="18">
							<uni-easyinput type="number" trim="all" v-model="formData.invitationCode"
								placeholder="请输入6位数字" />
						</uni-col>
						<uni-col :span="2">
						</uni-col>
						<uni-col :span="4" >
							<uni-icons type="help" size="30" @click="goHelp" style="padding: 30rpx;"></uni-icons>
						</uni-col>
					</uni-row>
				</uni-forms-item>
			</uni-group>
			<button @click="submitForm('form')">提交</button>
		</uni-forms>
		<view>
			<!-- 提示信息弹窗 -->
			<uni-popup ref="message" type="message" :value="popupMessage">
				<uni-popup-message :type="popupMessage.msgType" :message="popupMessage.messageText" :duration="2000">
				</uni-popup-message>
			</uni-popup>
		</view>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				formData: {
					serverId: '',
					unionName: '',
					invitationCode: '',
					serverNames: []
				},
				popupMessage: {
					type: 'center',
					msgType: 'success',
					messageText: '这是一条成功提示',
					value: ''
				},
				rules: {
					serverId: {
						rules: [{
								required: true,
								errorMessage: '请输入服务器编号',
							},
							{
								format: 'int',
								errorMessage: '必须是数字'
							},
						]
					},
					unionName: {
						rules: [{
							required: true,
							errorMessage: '请输入联盟名称',
						}, {
							minLength: 2,
							maxLength: 20,
							errorMessage: '联盟名称长度在 {minLength} 到 {maxLength} 个字符',
						}]
					},
					invitationCode: {
						rules: [{
							required: true,
							errorMessage: '请输入邀请码',
						}, {
							pattern: /^\d{6,6}$/,
							errorMessage: '邀请码为6位数字',
						}]
					},
					coordinateX: {
						rules: [{
							required: true,
							errorMessage: '请输入联盟要塞X坐标',
						}, {
							format: 'int',
							errorMessage: '必须是数字'
						}]
					},
					coordinateY: {
						rules: [{
							required: true,
							errorMessage: '请输入联盟要塞Y坐标',
						}, {
							format: 'int',
							errorMessage: '必须是数字'
						}]
					}
				}
			}
		},
		onReady() {
			this.$refs.form.setRules(this.rules)
		},
		methods: {
			submitForm: function(e) {
				let that= this
				uni.showLoading()
				this.$refs.form.submit().then(addUser => {
					uni.getUserProfile({
						desc: "用于完善会员资料",
						lang: "zh_CN",
						success: function(userProfile) {
							addUser.userId = getApp().globalData.user.id
							addUser.headImg = userProfile.userInfo.avatarUrl
							addUser.nickName = userProfile.userInfo.nickName
							uni.request({
								url: getApp().globalData.url + '/api/union/joinUnion',
								method: "POST",
								header: {
									'content-type': 'application/json',
                  'token':getApp().globalData.token
								},
								data: addUser,
								success: (res) => {
									if (res.data.code == "00000") {
										that.popupMessage.msgType = "success"
										that.popupMessage.messageText = "成功"
										that.$refs.message.open()
										uni.redirectTo({
											url: "/pages/union/union"
										})
									} else {
										that.popupMessage.msgType = "error"
										that.popupMessage.messageText = res.data.msg
										that.$refs.message.open()
									}
								}
							});
						}
					})
					uni.hideLoading()
					console.log('表单数据信息：', addUser);
				}).catch(err => {
					uni.hideLoading()
					console.log('表单错误信息：', err);
				})
			},
			formReset: function(e) {
				console.log('清空数据')
			},
			serverIdBlur: function(e) {
				this.formData.serverNames.splice(0, this.formData.serverNames.length);
				uni.request({
					url: getApp().globalData.url + '/api/union/list?serverId=' + e.detail.value,
					header: {
						'content-type': 'application/json',
            'token':getApp().globalData.token
					},
					success: (res) => {
						if (res.data.code == "00000") {

							for (var i = 0; i < res.data.data.length; i++) {
								this.formData.serverNames.push(res.data.data[i].name)
							}
							console.log(this.formData.serverNames)
						}
					}
				});
			},
			goHelp() {
				uni.navigateTo({
					url: "/pages/help/help"
				})
			}
		},
		onShareAppMessage: function( options ){
		　　var that = this;
		　　var shareObj = {
		　　　　path: '/pages/menu/menu'
		　　};
		　　return shareObj;
		}
	}
</script>

<style>
	.uni-form-item .title {
		padding: 20rpx 0;
	}

	.container {
		padding: 20rpx;
	}
</style>
